<template>
    <div class="common-title" :class="[bottom ? 'common-title-bottom': '', !padding ? 'no-padding' : '', weight ? 'weight' : '']">
        <slot></slot>
    </div>
</template>
<script>
export default {
    name: 'commonTitle',
    props: {
        bottom: {
            type: Boolean,
            default () {
                return true
            }
        },
        padding: {
            type: Boolean,
            default () {
                return true
            }
        },
        weight: {
            type: Boolean,
            default () {
                return false
            }
        }
    }
}
</script>
<style lang="less" scoped>
.common-title {
    padding-left: 20px;
    font-size: 16px;
    color: #333;
    height: 60px;
    line-height: 60px;
    &.common-title-bottom {
        border-bottom: 1px solid #E9EDF4;
    }
    &.no-padding {
        padding: 0;
    }
    &.weight {
        font-weight: 600;
    }
}
</style>